<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div id="div1" style="height: 100px;border: 1px solid red;"></div>

    <script>
        // 要去重的数组1
        var arr1 = [1, 1, 1, 1, 2, 5, 5, 4, 4, 4, 3, 6];
        // 要去重的数组2
        var arr2 = [45, 7, 45, 422, 45, 45, 123, 45];
        // 被操作的元素
        var div_ = document.getElementById('div1');

        function removeDup(arr, fn) {
            var res = []; // 这个res是一个空数组 用来盛放去重后的内容
            for (var i = 0; i < arr.length; i++) {  // 遍历arr1或者arr2
                if (res.indexOf(arr[i]) == -1) { // 判断arr1的内容是否存在于res中 不存在就是-1就会push
                    res.push(arr[i]);
                }
                // for循环执行完之后 res就是去重之后的结果
            }
            console.log(res); //拿到去重之后的结果

            if (typeof fn === 'function') { // 判断fn是不是函数 == ===的区别
                fn(res.length); //res.length 是实参
            }
        }

        // arr1对应22行的arr是第一个参数 后面的function是第二个参数，叫回调函数
        removeDup(arr1, function (value) {
            // value 是形参
            console.log(value);
            if (value > 5) { // res这个数组的长度
                //超纲知识点，通过js设置页面元素的样式；
                div_.style.background = 'red';
                // document.write('我好榜啊');
            }
        });

    </script>
</body>

</html>